<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">
<f:view contentType="text/html">
	<h:head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<link rel="stylesheet"
			href="${request.contextPath}/resources/css/style.css" type="text/css"
			media="screen" />
		<link rel="stylesheet"
			href="${request.contextPath}/resources/css/styleButton.css"
			type="text/css" media="screen" />
		<link rel="shortcut icon"
			href="${request.contextPath}/resources/img/favicon.ico" />
		<title><ui:insert name="title"></ui:insert></title>
	</h:head>
	<h:body>
		<div id="page">
			<div id="menu">
				<ui:insert name="header">
					<center>
						<ui:include src="/template/commonHeader.xhtml" />
					</center>
				</ui:insert>
			</div>
			<div id="line" />
			<div id="content">
				<br />
				<h:form id="formIndexSemester">
					<p:commandButton value="&nbsp;ADD NEW SEMESTER"
						styleClass="addButton"
						action="#{semesterController.preparedAdding()}"
						update=":formAddSemester:panelAdd" oncomplete="dialogAdd.show();" />
				</h:form>
				<br />
				<!-- List Semester -->
				<h:form id="formListSemester">
					<p:dataTable id="listDatatable" var="semesterList"
						value="#{semesterController.listSemester}"
						style="width:90%; padding-top: 3px; padding-bottom: 10px; padding-left: 5%;  vertical-align: top;"
						paginator="true" rows="10"
						paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
						paginatorPosition="bottom" rowsPerPageTemplate="5,10,20"
						selection="#{studentController.student}">

						<p:column headerText="ID">
							<h:outputText value="#{semesterList.semester_id}" />
						</p:column>

						<p:column headerText="SEMESTER">
							<h:outputText value="#{semesterList.semester_name}" />
						</p:column>

						<p:column headerText="SEMESTER DATE">
							<h:outputText value="#{semesterList.semester_date}" size="10" />
						</p:column>

						<p:column style="width:%4; vertical-align:center"
							headerText="EDIT | DELETE">
							<p:commandButton icon="ui-icon-wrench"
								update=":formEditSemester:panelEdit"
								action="#{semesterController.preparedEditing(semesterList.semester_id)}"
								oncomplete="dialogEdit.show();" />&nbsp;&nbsp;&nbsp;
						<p:commandButton icon="ui-icon-trash"
								update=":formDeleteSemester:dialogDelete"
								action="#{semesterController.preparedDeleting(semesterList.semester_id)}"
								oncomplete="dialogDelete.show();" />
						</p:column>

					</p:dataTable>
				</h:form>

				<!-- Add New Semester -->
				<h:form id="formAddSemester">
					<p:dialog header="Add New Semester" id="dialogAdd"
						widgetVar="dialogAdd" resizable="false" modal="true"
						showEffect="fade" hideEffect="explode">
						<p:growl id="growlAdd" showDetail="true" sticky="true" />
						<h:panelGrid id="panelAdd" columns="3" style="margin:0 auto;">
							<h:panelGroup>
								<h:outputText styleClass="outputText" value="SEMESTER :" />
								<h:outputText style="color: red; float: right" value=" * " />
							</h:panelGroup>
							<h:inputText value="#{semesterController.semester.semester_name}"
								id="semester" />
							<h:message for="semester" errorStyle="color:red" />

							<h:panelGroup>
								<h:outputText styleClass="outputText" value="SEMESTER DATE :" />
								<h:outputText style="color:red; float: right" value=" * " />
							</h:panelGroup>
							<p:calendar value="#{semesterController.semester.semester_date}"
								id="popupCal" pattern="dd/MM/yyyy">
								<f:convertDateTime type="date" dateStyle="short"
									pattern="dd/MM/yyyy" />
							</p:calendar>
						</h:panelGrid>
						<p:separator />
						<p:separator />
						<p:commandButton value="&nbsp;Save"
							update=":formListSemester:listDatatable, growlAdd, dialogAdd"
							actionListener="#{semesterController.save}"
							oncomplete="dialogAdd.hide()" icon="ui-icon-disk" />&nbsp;&nbsp;
                	<p:commandButton value="&nbsp;Cancel"
							update=":formListSemester:listDatatable"
							oncomplete="dialogAdd.hide()" icon="ui-icon-circle-close" />
					</p:dialog>
				</h:form>

				<!-- Edit Semester -->
				<h:form id="formEditSemester">
					<p:dialog header="Edit Employee" id="dialogEdit"
						widgetVar="dialogEdit" resizable="false" modal="true"
						showEffect="fade" hideEffect="explode">
						<p:growl id="growlEdit" showDetail="true" sticky="true" />
						<h:panelGrid id="panelEdit" columns="3" cellpadding="4"
							style="margin:0 auto;">
							<h:panelGroup>
								<h:outputText styleClass="outputText" value="SEMESTER :" />
								<h:outputText style="color: red; float: right" value=" * " />
							</h:panelGroup>
							<h:inputText value="#{semesterController.semester.semester_name}"
								id="semester" />
							<h:message for="semester" errorStyle="color:red" />

							<h:panelGroup>
								<h:outputText styleClass="outputText" value="SEMESTER DATE :" />
								<h:outputText style="color:red; float: right" value=" * " />
							</h:panelGroup>
							<p:calendar value="#{semesterController.semester.semester_date}"
								id="popupCal" pattern="dd/MM/yyyy">
								<f:convertDateTime type="date" dateStyle="short"
									pattern="dd/MM/yyyy" />
							</p:calendar>

						</h:panelGrid>
						<p:separator />
						<p:separator />
						<p:commandButton value="&nbsp;Update"
							update=":formListSemester:listDatatable, growlEdit, dialogEdit"
							actionListener="#{semesterController.update}"
							oncomplete="dialogEdit.hide()" icon="ui-icon-transferthick-e-w" />&nbsp;&nbsp;
                	<p:commandButton value="&nbsp;Cancel"
							update=":formListSemester:listDatatable"
							oncomplete="dialogEdit.hide()" icon="ui-icon-circle-close" />
					</p:dialog>
				</h:form>


				<!-- Delete Semester -->
				<h:form id="formDeleteSemester">
					<p:growl id="growlDelete" sticky="true" />
					<p:confirmDialog id="dialogDelete"
						message="Are you sure about deleting the field?"
						header="Initializing destroy process" severity="alert"
						widgetVar="dialogDelete">
						<p:commandButton value="&nbsp;Delete"
							update=":formListSemester:listDatatable, growlDelete"
							actionListener="#{semesterController.remove}"
							oncomplete="dialogDelete.hide();" icon="ui-icon-trash" />&nbsp;&nbsp;
                	<p:commandButton value="&nbsp;Cancel"
							update=":formListSemester:listDatatable"
							oncomplete="dialogDelete.hide();" icon="ui-icon-circle-close" />
					</p:confirmDialog>
				</h:form>

			</div>
			<div id="line" />
			<br />
			<div id="footer">
				<ui:insert name="footer">
					<ui:include src="/template/commonDock.xhtml" />
				</ui:insert>
			</div>
		</div>
	</h:body>
</f:view>
</html>
